<template>
  <view class="news-list">
    <view class="new-list-cotent" v-for="item in newsList" @click="goNewsDetail(item.content.news_item[0])">
      <view class="new-title-cotent-container">
        <view class="new-list-cotent-title">{{item.content.news_item[0].title}}</view>
        <view class="new-list-cotent-time">{{item.update_time}}</view>
      </view>
      <image :src="item.content.news_item[0].thumb_url" mode="aspectFill"></image>
    </view>
    <uv-load-more status="nomore" line v-if="newsList.length!=0" />
  </view>
  <uv-empty mode="list" v-if="newsList.length==0" text="暂无热门资讯"></uv-empty>
</template>

<script>
	import request from '@/utils/request'
	import {formatDateText} from '@/utils/times.js'
	import customRouter from '@/utils/customRouter.js'
	export default {
		data() {
			return {
				newsList:[]
			};
		},
		methods:{
			getNewsList() {
			    let _this = this
			    request.get('/api/Wechat/GetArticleList', { Page: 1, Limit: 9999 }).then(res=>{
					if(!res.Data.item||res.Data.item.length<1) return 
					res.Data.item.forEach((t) => {
						console.log(t.update_time);
					  t.update_time =formatDateText(t.update_time,'number')
					})
					this.newsList=res.Data.item
				})
			},
			goNewsDetail(item){
				getApp().globalData.newsDetailUrl=item.url
				customRouter.navigateTo(({
					url:`/pages/tabbar/workbench/newsDetail/newsDetail`
				}))
			}
		},
		created(){
			this.getNewsList()
		}
	}
</script>

<style lang="scss" scoped>
.expect-Unverified {
  height: 100%;
  padding-bottom: 50rpx;
  background-color: transparent;
}

.news-list {
  margin: 10rpx 24rpx 24rpx 24rpx;
  background: #FFFFFF;
  border-radius: 16px;
  padding-bottom: 8rpx;
}

.news-list .new-list-title {
  padding: 16rpx 16rpx 16rpx 24rpx;
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.news-list .new-list-title:active {
  background-color: #f2f3f5;
}

.news-list .new-list-title view {
  display: flex;
  align-items: center;
}

.news-list .new-list-title .left text {
  font-family: PingFangSC-Medium;
  font-size: 30rpx;
  color: #303030;
  letter-spacing: 0.17rpx;
  font-weight: 500;
}

.news-list .new-list-cotent {
  /* padding: 0rpx 24rpx; */
  display: flex;
  justify-content: space-between;
  align-items: center;
  border-bottom: 1rpx solid #E1E1E1;
  /* padding-bottom: 16rpx;
  padding-top: 16rpx; */
  padding: 16rpx 24rpx 16rpx 24rpx;
}

.news-list .new-list-cotent:active {
  background-color: #f2f3f4;
}

.news-list .new-list-cotent:last-child {
  border-bottom: none;
}

.news-list .new-list-cotent .new-title-cotent-container {
  height: 156rpx;
  padding-top: 19rpx;
  padding-bottom: 16rpx;
  display: flex;
  flex-direction: column;
  justify-content: space-around;
}

.news-list .new-list-cotent .new-list-cotent-title {
  width: 388rpx;
  /* height: 104rpx; */
  font-family: PingFangSC-Regular;
  font-size: 26rpx;
  color: #303030;
  letter-spacing: 0.15rpx;
  font-weight: 400;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
  text-overflow: ellipsis;
  /* margin-bottom: 50rpx; */
}

.news-list .new-list-cotent .new-list-cotent-time {
  font-family: PingFangSC-Regular;
  font-size: 22rpx;
  color: #666666;
  letter-spacing: 0.13rpx;
  font-weight: 400;
}

.news-list .new-list-cotent image {
  width: 220rpx;
  height: 156rpx;
  /* padding-right: 24rpx; */
  border-radius: 8rpx;
}

.new-list-cotent-line {
  margin-top: 12rpx;
  margin-bottom: 12rpx;
  width: 100%;
  height: 1rpx;
  background: #E1E1E1;
}</style>
